<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@include file="/taglibs.jsp"%>
 <!DOCTYPE html>    
<html>    
<head>    
<meta charset="utf-8">    
<title>微信JS-SDK Demo</title>    
</head>    
<body ontouchstart="">    
<div class="wxapi_container">    
<div class="wxapi_index_container">    
<ul class="label_box lbox_close wxapi_index_list">    
<li class="label_item wxapi_index_item"><a class="label_inner" href="#menu-basic">基础接口</a></li>    
<li class="label_item wxapi_index_item"><a class="label_inner" href="#menu-share">分享接口</a></li>    
<li class="label_item wxapi_index_item"><a class="label_inner" href="#menu-image">图像接口</a></li>    
<li class="label_item wxapi_index_item"><a class="label_inner" href="#menu-voice">音频接口</a></li>    
<li class="label_item wxapi_index_item"><a class="label_inner" href="#menu-smart">智能接口</a></li>    
<li class="label_item wxapi_index_item"><a class="label_inner" href="#menu-device">设备信息接口</a></li>    
<li class="label_item wxapi_index_item"><a class="label_inner" href="#menu-location">地理位置接口</a></li>    
<li class="label_item wxapi_index_item"><a class="label_inner" href="#menu-webview">界面操作接口</a></li>    
<li class="label_item wxapi_index_item"><a class="label_inner" href="#menu-scan">微信扫一扫接口</a></li>    
<li class="label_item wxapi_index_item"><a class="label_inner" href="#menu-shopping">微信小店接口</a></li>    
<li class="label_item wxapi_index_item"><a class="label_inner" href="#menu-card">微信卡券接口</a></li>    
<li class="label_item wxapi_index_item"><a class="label_inner" href="#menu-pay">微信支付接口</a></li>    
</ul>    
</div>    
<div class="lbox_close wxapi_form">    
<h3 id="menu-basic">基础接口</h3>    
<span class="desc">判断当前客户端是否支持指定JS接口</span>    
<button class="btn btn_primary" id="checkJsApi">checkJsApi</button>    
<h3 id="menu-share">分享接口</h3>    
<span class="desc">获取“分享到朋友圈”按钮点击状态及自定义分享内容接口</span>    
<button class="btn btn_primary" id="onMenuShareTimeline">onMenuShareTimeline</button>    
<span class="desc">获取“分享给朋友”按钮点击状态及自定义分享内容接口</span>    
<button class="btn btn_primary" id="onMenuShareAppMessage">onMenuShareAppMessage</button>    
<span class="desc">获取“分享到QQ”按钮点击状态及自定义分享内容接口</span>    
<button class="btn btn_primary" id="onMenuShareQQ">onMenuShareQQ</button>    
<span class="desc">获取“分享到腾讯微博”按钮点击状态及自定义分享内容接口</span>    
<button class="btn btn_primary" id="onMenuShareWeibo">onMenuShareWeibo</button>    
<h3 id="menu-image">图像接口</h3>    
<span class="desc">拍照或从手机相册中选图接口</span>    
<button class="btn btn_primary" id="chooseImage">chooseImage</button>    
<span class="desc">预览图片接口</span>    
<button class="btn btn_primary" id="previewImage">previewImage</button>    
<span class="desc">上传图片接口</span>    
<button class="btn btn_primary" id="uploadImage">uploadImage</button>    
<span class="desc">下载图片接口</span>    
<button class="btn btn_primary" id="downloadImage">downloadImage</button>    
<h3 id="menu-voice">音频接口</h3>    
<span class="desc">开始录音接口</span>    
<button class="btn btn_primary" id="startRecord">startRecord</button>    
<span class="desc">停止录音接口</span>    
<button class="btn btn_primary" id="stopRecord">stopRecord</button>    
<span class="desc">播放语音接口</span>    
<button class="btn btn_primary" id="playVoice">playVoice</button>    
<span class="desc">暂停播放接口</span>    
<button class="btn btn_primary" id="pauseVoice">pauseVoice</button>    
<span class="desc">停止播放接口</span>    
<button class="btn btn_primary" id="stopVoice">stopVoice</button>    
<span class="desc">上传语音接口</span>    
<button class="btn btn_primary" id="uploadVoice">uploadVoice</button>    
<span class="desc">下载语音接口</span>    
<button class="btn btn_primary" id="downloadVoice">downloadVoice</button>    
<h3 id="menu-smart">智能接口</h3>    
<span class="desc">识别音频并返回识别结果接口</span>    
<button class="btn btn_primary" id="translateVoice">translateVoice</button>    
<h3 id="menu-device">设备信息接口</h3>    
<span class="desc">获取网络状态接口</span>    
<button class="btn btn_primary" id="getNetworkType">getNetworkType</button>    
<h3 id="menu-location">地理位置接口</h3>    
<span class="desc">使用微信内置地图查看位置接口</span>    
<button class="btn btn_primary" id="openLocation">openLocation</button>    
<span class="desc">获取地理位置接口</span>    
<button class="btn btn_primary" id="getLocation">getLocation</button>    
<h3 id="menu-webview">界面操作接口</h3>    
<span class="desc">隐藏右上角菜单接口</span>    
<button class="btn btn_primary" id="hideOptionMenu">hideOptionMenu</button>    
<span class="desc">显示右上角菜单接口</span>    
<button class="btn btn_primary" id="showOptionMenu">showOptionMenu</button>    
<span class="desc">关闭当前网页窗口接口</span>    
<button class="btn btn_primary" id="closeWindow">closeWindow</button>    
<span class="desc">批量隐藏功能按钮接口</span>    
<button class="btn btn_primary" id="hideMenuItems">hideMenuItems</button>    
<span class="desc">批量显示功能按钮接口</span>    
<button class="btn btn_primary" id="showMenuItems">showMenuItems</button>    
<span class="desc">隐藏所有非基础按钮接口</span>    
<button class="btn btn_primary" id="hideAllNonBaseMenuItem">hideAllNonBaseMenuItem</button>    
<span class="desc">显示所有功能按钮接口</span>    
<button class="btn btn_primary" id="showAllNonBaseMenuItem">showAllNonBaseMenuItem</button>    
<h3 id="menu-scan">微信扫一扫</h3>    
<span class="desc">调起微信扫一扫接口</span>    
<button class="btn btn_primary" id="scanQRCode0">scanQRCode(微信处理结果)</button>    
<button class="btn btn_primary" id="scanQRCode1">scanQRCode(直接返回结果)</button>    
<h3 id="menu-shopping">微信小店接口</h3>    
<span class="desc">跳转微信商品页接口</span>    
<button class="btn btn_primary" id="openProductSpecificView">openProductSpecificView</button>    
<h3 id="menu-card">微信卡券接口</h3>    
<span class="desc">批量添加卡券接口</span>    
<button class="btn btn_primary" id="addCard">addCard</button>    
<span class="desc">调起适用于门店的卡券列表并获取用户选择列表</span>    
<button class="btn btn_primary" id="chooseCard">chooseCard</button>    
<span class="desc">查看微信卡包中的卡券接口</span>    
<button class="btn btn_primary" id="openCard">openCard</button>    
<h3 id="menu-pay">微信支付接口</h3>    
<span class="desc">发起一个微信支付请求</span>    
<button class="btn btn_primary" id="chooseWXPay">chooseWXPay</button>    
</div>    
</div>    
</body>    
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>    
<script> 

    	// 1. ajax get signature 
	//	http://www.tiaonali.com/humanhunter/util/getJSSignature.do?timestamp=123456&nonce=12345&url=http://www.tiaonali.com/views/NewFile.jsp
	var obj ={
	"timestamp": "1438005290",
    "nonceStr": "5c047af6-b098-43b1-a4fa-726e53b8c82f",
    "jsapi_ticket": "sM4AOVdWfPE4DxkXGEs8VFLGRLUbysYvwtwPbyh-tbH8pLen8HYqxo7lRh9QDnUezchiUHTvRw5U7YE0M9-Gqg",
    "signature": "64669d4cf19f46b0af49e0db533c1f1d71273dae",
    "url": "http://www.tiaonali.com/views/NewFile.jsp"
};
    	

    	wx.config({
    	    debug: true, // 开启调试模式,调用的所有api的返回值会在客············1户端alert去·出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
    	    appId: 'wxd82bb0fb3bcf8ad4', // 必填，公众号的唯一标识
    	    timestamp: 1438005290, // 必填，生成签名的时间戳
    	    nonceStr: obj.nonceStr, // 必填，生成签名的随机串
    	    signature:  obj.signature,// 必填，签名，见附录1
    	       jsApiList: [
        'checkJsApi',
        'onMenuShareTimeline',
        'onMenuShareAppMessage',
        'onMenuShareQQ',
        'onMenuShareWeibo',
        'hideMenuItems',
        'showMenuItems',
        'hideAllNonBaseMenuItem',
        'showAllNonBaseMenuItem',
        'translateVoice',
        'startRecord',
        'stopRecord',
        'onRecordEnd',
        'playVoice',
        'pauseVoice',
        'stopVoice',
        'uploadVoice',
        'downloadVoice',
        'chooseImage',
        'previewImage',
        'uploadImage',
        'downloadImage',
        'getNetworkType',
        'openLocation',
        'getLocation',
        'hideOptionMenu',
        'showOptionMenu',
        'closeWindow',
        'scanQRCode',
        'chooseWXPay',
        'openProductSpecificView',
        'addCard',
        'chooseCard',
        'openCard'
      ]
    	}); 
	    
</script>

<script src="${ctx}/resources/demo.js" type="text/javascript"></script>
</body>
</html>